<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pe="http://primefaces.org/ui/extensions">

<f:view contentType="text/html">
	<h:head>
		<f:facet name="first">
			<meta http-equiv="X-UA-Compatible" content="EmulateIE8" />
			<meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
			<title>..::Sistema de Disponiblidad de Aulas::..</title>
		</f:facet>
		<link type="text/css" rel="stylesheet"
			href="#{request.contextPath}/resources/css/indexEstiloSchedule.css" />
	</h:head>
	<h:body>
		<p:idleMonitor timeout="300000">
				<p:ajax event="idle" onstart="document.location.href = document.location.href;"/>
		</p:idleMonitor>
		<pe:layout fullPage="true">
			<pe:layoutPane position="north" closable="false" resizable="false"
				style="padding:0">
				<h:panelGrid columns="2" styleClass="fondoEncabezado"
					style="width:100%;">

					<h:form style="text-align:left;">
						<!--<p:graphicImage value="/resources/img/encabezadoIzq.JPG"
							style="height: 70px; width: 250px" />  -->
						<iframe
							src="/sisdiam/resources/encabezados/izquierdoSchedule/izquierdo.html"
							width="250px" height="85px" frameborder="0" scrolling="no"
							allowTransparency="true"></iframe>

					</h:form>

					<h:form style="text-align:right;">
						<!--  <p:graphicImage value="/images/ui/encabezadoDer3.JPG"
							style="height: 70px; width: 200px" />-->
						<iframe
							src="/sisdiam/resources/encabezados/derechoSchedule/derecho.html"
							width="400px" height="85px" frameborder="0" scrolling="no"
							allowTransparency="true"></iframe>
					</h:form>
				</h:panelGrid>
			</pe:layoutPane>
			<pe:layoutPane id="lycseleccion"  position="center" style="padding:0">
				<!-- Este layoutCentro tiene un estilo definido por su id -->
				<h:form  prependId="false" id="login_form">
					<p:growl id="idGrowl" for="mensajes"
						sticky="true" />

					<!--<p:growl id="idGrowl" life="6000" sticky="true" for="mensajes">
				        <h:outputScript>
				            $("#idGrowl_container").effect("pulsate", { times:1 }, 4000);
				        </h:outputScript>
				    </p:growl>  -->
					<p:panel id="panelLogin" header="Iniciar Sesión"
						style="border:2px solid black;width:330px; margin-left:62%;margin-right:5%; margin-top:12%;font-size:13px">
						<h:panelGrid columns="3">
							<h:outputText value="* Usuario: " />
							<p:inputText id="usuario" required="true"
								value="#{loginScheduleController.codigo}"
								requiredMessage="usuario requerido" />
							<h:outputText value="" />
							<h:outputText value="" />
							<p:message for="usuario" />
							<h:outputText value="" />
							
							<h:outputText value="* Contraseña: " />
							<p:password id="password" required="true" requiredMessage="password requerido"
								value="#{loginScheduleController.password}" />
							<!--  <p:password id="password" required="true" feedback="true" inline="true" promptLabel="ingrese su clave" weakLabel="dÃƒÂ©bil"  
                        		goodLabel="bueno" strongLabel="seguro" requiredMessage="password requerido"
								value="#{loginController.password}" />-->
							<h:outputText value="" />
							<p:message for="password" />
						</h:panelGrid>
						<h:outputText value="" />
						<!--<h:panelGrid columns="2" cel-spacing="2">
							<p:selectBooleanCheckbox value="#{loginController.rememberMe}" />
							<h:outputText value="Recordarme en el equipo"
								style="font-size:12px;font-style: italic" />
						</h:panelGrid>  -->
						<p:commandButton id="loginb" value="INGRESAR"
							actionListener="#{loginScheduleController.login}" update="panelLogin, idGrowl"
							style="margin-left:106px;margin-top:5px" />
						<br></br>
						<br></br>
						<p:commandLink id="olvidoPass" onclick="PF('recDialog').show();"
							style="margin-left:84px;font-size:12px;font-style:italic;color:#FF0000">
							<h:outputText value="¿Olvidó su contraseña?"/>
						</p:commandLink>
						<p:tooltip for="olvidoPass" value="Recuperar su contraseña" showEffect="fade" hideEffect="explode" />
						
						
					</p:panel>
					
					
				</h:form>
				
				<h:form id="dialogForm">
					<p:growl id="growl" life="3000" />
					<p:dialog widgetVar="recDialog" draggable="false" 
						header="Recuperar Contraseña" showEffect="clip"
						hideEffect="clip" closable="false">
							
						<h:panelGrid columns="2"
							style="text-align:center;margin-left:auto;margin-right:auto">
							
							<h:outputLabel for="usuarioRec" value="Usuario: " />
							<p:inputText id="usuarioRec"
								value="#{loginScheduleController.usuarioRecuperar}"
								required="true" requiredMessage="No ha ingresado usuario."/>
							
							<p:commandButton id="enviar" value="Solicitar contraseña"
								actionListener="#{loginScheduleController.enviarPassword}"
								onstart="PF('recDialog').hide(),PF('statusDialog').show();"
								oncomplete="PF('statusDialog').hide();"
								update="growl"/>
							
							<p:commandButton id="cancelar" value="Cancelar" 
								actionListener="#{loginScheduleController.limpiarUsuarioRec}"
								update="usuarioRec" 
								onclick="PF('recDialog').hide();"/>
						</h:panelGrid>
							
					</p:dialog>
						
					<p:dialog widgetVar="statusDialog" draggable="false"
						closable="false" resizable="false" 
						header="PROCESANDO...">
						<h:panelGrid columns="1"
							style="text-align:center;margin-left:auto;margin-right:auto">
							<h:outputText value="PROCESANDO SOLICITUD..." />
							<br />
							<p:graphicImage value="/resources/img/progress_bar.gif"
								style="text-align:center;margin-left:auto;margin-right:auto" />
						</h:panelGrid>
					</p:dialog>
						
					
				</h:form>
			</pe:layoutPane>
			<pe:layoutPane position="south" closable="false" resizable="false"
				style="padding:0">
				<h:panelGrid columns="2" styleClass="fondoFooter"
					style="width:100%;height:55px">
					<h:form
						style="text-align:left;color:#FFFFFF;margin-left:10px;font-weight: bold">
						<h:outputText value="SISDIAM - Sistema de Disponibilidad de Ambientes V 1.0" />
					</h:form>

					<h:form
						style="text-align:right;color:#FFFFFF;margin-right:10px;font-weight: bold">
						<h:outputText value="Area de Desarrollo de Software" />
					</h:form>
				</h:panelGrid>
			</pe:layoutPane>
		</pe:layout>
	</h:body>

</f:view>
</html>